import React, { Component } from "react";
import { TabBar } from "zarm";
import "../../iconfont/iconfont.css";
import "./tabbar.scss";
const tabbar = [
  {
    key: "/home",
    title: "首页",
    icon: <i className="iconfont icon-home" />,
  },
  {
    key: "/mine",
    title: "我的",
    icon: <i className="iconfont icon-mine" />,
  },
];
export default class Tabbar extends Component {
  tabbarItem = () => {
    return tabbar.map((item) => {
      return (
        <TabBar.Item
          key={item.key}
          itemKey={item.key}
          title={item.title}
          icon={item.icon}
        />
      );
    });
  };
  render() {
    const activeKey = this.props.location.pathname;
    return (
      <TabBar
        activeKey={activeKey}
        onChange={(activeKey) => {
          this.props.history.push(activeKey);
        }}
      >
       {this.tabbarItem()}
      </TabBar>
    );
  }
}
